<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <th:block th:include="fragments/header :: header"/>
    <title>枚举管理</title>
    <script type="text/javascript" th:inline="none">
        $(function () {
            initDataGrid();
            initToolbar();
        });

        //初始化表格
        function initDataGrid() {
            $("#dgEnumList").datagrid({
                url: '/markt/enumManage/list',
                idField: 'id',
                frozenColumns:[[
                    {field:'ck',checkbox:true}
                ]],
                columns: [[
                    {field: 'name', title: '名称', width: 80}
                ]],
                rownumbers:true,
                toolbar:'#dgEnumList-toolbar',
                singleSelect:true,
                onSelect:function (rowIndex, rowData) {
                    // console.log(rowData);
                    $("#dgEnumItemList").datagrid({
                        url:'/markt/enumManageItem/list',
                        idField: 'id',
                        frozenColumns:[[
                            {field:'ck',checkbox:true}
                        ]],
                        columns: [[
                            {field: 'name', title: '名称', width: 80},
                            {field: 'location', title: '排序', width: 80}
                        ]],
                        queryParams:{
                            enumId:rowData.id
                        }
                    })
                },
                onLoadSuccess:function (data) {
                    $('#dgEnumList').datagrid("selectRow", 0);//默认选中第一行
                }
            })
        }

        function initToolbar() {
            $("#btnAdd").click(function () {
                layer.open({
                    type:2,
                    title:'添加枚举',
                    area:['500px','300px'],
                    content:'/markt/enumManage/add',
                    end: function () {
                        $("#dgEnumList").datagrid("reload");
                    }
                });
            });

            $("#btnEdit").click(function () {
                var sel = $("#dgEnumList").datagrid('getSelected');
                if (sel) {
                    layer.open({
                        type: 2,
                        area:['500px','300px'],
                        content: '/markt/enumManage/edit/' + sel.id,
                        end: function () {
                            $("#dgEnumList").datagrid("reload");
                        }
                    });
                }
            });

            $("#btnRemove").click(function () {
                var sel = $("#dgEnumList").datagrid('getSelected');
                if (sel) {
                    $.ajax({
                        url: '/markt/enumManage/doDelete/' + sel.id,
                        type: 'DELETE',
                        success: function (data) {
                            if (data.success) {
                                $("#dgEnumList").datagrid("reload");
                            }
                        }
                    });
                }else {
                    layer.msg("请选择要删除的项！");
                }
            });

            $("#btnItemAdd").click(function () {
                var sel = $("#dgEnumList").datagrid('getSelected');
                if (sel) {
                    layer.open({
                        type:2,
                        area:['500px','300px'],
                        content:'/markt/enumManageItem/add/'+sel.id,
                        end: function () {
                            //$("#dgEnumItemList").datagrid("reload");
                        }
                    });
                }
            });

            $("#btnItemEdit").click(function () {
                var sel = $("#dgEnumItemList").datagrid('getSelected');
                if (sel){
                    layer.open({
                        type:2,
                        area:['500px','300px'],
                        content:'/markt/enumManageItem/edit/'+sel.id,
                        end: function () {
                            //$("#dgEnumItemList").datagrid("reload");
                        }
                    });
                }
            });

            $("#btnItemRemove").click(function () {
                var sel = $("#dgEnumItemList").datagrid('getSelected');
                if (sel) {
                    $.ajax({
                        url: '/markt/enumManageItem/doDelete/' + sel.id,
                        type: 'DELETE',
                        success: function (data) {
                            if (data.success) {
                                //$("#dgEnumList").datagrid("reload");
                            }
                        }
                    });
                }else {
                    layer.msg("请选择要删除的项！");
                }
            });
        }
    </script>
</head>
<body>
<div class="easyui-layout" style="width:100%;height:700px;">
    <div data-options="region:'west',split:true" style="width:200px;padding-right: 1px">
        <div id="dgEnumList-toolbar" style="padding: 2px 0;" class="datagrid-toolbar">
            <table cellpadding="0" cellspacing="0" style="width: 100%">
                <tr>
                    <td style="padding-left: 2px">
                        <a id="btnAdd" href="javascript:void(0)" class="easyui-linkbutton" style="float: left">新增</a>
                        <a id="btnEdit" href="javascript:void(0)" class="easyui-linkbutton" style="float: left">编辑</a>
                        <a id="btnRemove" href="javascript:void(0)" class="easyui-linkbutton" style="float: left">删除</a>
                    </td>
                </tr>
            </table>
        </div>
        <table id="dgEnumList">

        </table>
    </div>
    <div data-options="region:'center',split:true" style="width: 200px">
        <div id="dgEnumItemList-toolbar" style="padding: 2px 0;" class="datagrid-toolbar">
            <table cellpadding="0" cellspacing="0" style="width: 100%">
                <tr>
                    <td style="padding-left: 2px">
                        <a id="btnItemAdd" href="javascript:void(0)" class="easyui-linkbutton" style="float: left">新增</a>
                        <a id="btnItemEdit" href="javascript:void(0)" class="easyui-linkbutton" style="float: left">编辑</a>
                        <a id="btnItemRemove" href="javascript:void(0)" class="easyui-linkbutton" style="float: left">删除</a>
                    </td>
                </tr>
            </table>
        </div>
        <div>
            <table id="dgEnumItemList">

            </table>
        </div>
    </div>
</div>
</body>
</html>
